const topvElements = document.querySelectorAll('.topv');
const topmElements = document.querySelectorAll('.topm');

topvElements.forEach((topv, index) => {
    const topm = topmElements[index];

    topv.addEventListener('mouseenter', () => {
        topm.addEventListener('animationend', function() {
            topm.classList.add('msghid');
            topm.classList.remove('msghidfadeout');
        }, {once: true});
        topm.classList.add('msghidfadeout');
    });

    topv.addEventListener('mouseleave', () => {
        topm.addEventListener('animationend', function() {
            topm.classList.remove('msghid');
            topm.classList.remove('msghidfadein');
        }, {once: true});
        topm.classList.add('msghidfadein');
    });
});
